import 'package:flutter/material.dart';
import '../pages/bottomNav.dart';
import '../util/ToastUtils.dart';

class TestUI extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
        return new MaterialApp(
            title: '奇妙时代',
            home: new TestUIPage(),
        );
    }
}


class TestUIPageState extends State<TestUIPage> {
    PointerEvent _event;
    
    Widget build(BuildContext context) {
        return new Scaffold (
            appBar: new AppBar(
                title: new Text('奇妙时代'),
            ),
            body: _wrapDemo(),
            bottomNavigationBar: new BottomNav(1),
        );
    }
    
    //测试表格式行列布局
    Widget _tableDemo() {
        return Table(
            columnWidths: const <int, TableColumnWidth>{
                //0: FixedColumnWidth(50.0), //不定义，自动均分，table=100%宽度
                //1: FixedColumnWidth(100.0),
                //2: FixedColumnWidth(50.0),
                //3: FixedColumnWidth(100.0),
            },
            border: TableBorder.all(color: Colors.blue, width: 1.0, style: BorderStyle.solid),
            children: const <TableRow>[
                TableRow(
                    children: <Widget>[
                        TableCell(
                            child: Center(
                                child: Padding(
                                    padding: EdgeInsets.all(10.0),
                                    child: Text('A1'),
                                ),
                            ),
                        ),
                        TableCell(
                            child: Padding(
                                padding: EdgeInsets.all(10.0),
                                child: Text('B1'),
                            ),
                        ),
                        TableCell(
                            child: Padding(
                                padding: EdgeInsets.all(10.0),
                                child: Text('C1'),
                            ),
                        ),
                        TableCell(
                            child: Padding(
                                padding: EdgeInsets.all(10.0),
                                child: Text('D1'),
                            ),
                        ),
                    ],
                ),
                TableRow(
                    children: <Widget>[
                        Text('A2'),
                        Text('B2'),
                        Text('C2'),
                        Text('D2'),
                    ],
                ),
                TableRow(
                    children: <Widget>[
                        Text('A3'),
                        Text('B3'),
                        Text('C3'),
                        Text('D3'),
                    ],
                ),
            ],
        );
    }
    
    //测试Wrap布局--适配屏幕宽度，摆不下的时候内容自动向下扩展
    Widget _wrapDemo() {
        return Wrap(
            spacing: 8.0, // gap between adjacent chips
            runSpacing: 4.0, // gap between lines
            children: <Widget>[
                Chip(
                    avatar: CircleAvatar(
                        backgroundColor: Colors.blue.shade900, child: new Text('A', style: TextStyle(fontSize: 10.0),)),
                    label: Text('阿勇'),
                ),
                Chip(
                    avatar: CircleAvatar(
                        backgroundColor: Colors.blue.shade900, child: new Text('B', style: TextStyle(fontSize: 10.0),)),
                    label: Text('北京'),
                ),
                Chip(
                    avatar: CircleAvatar(
                        backgroundColor: Colors.blue.shade900, child: new Text('C', style: TextStyle(fontSize: 10.0),)),
                    label: Text('陈经'),
                ),
                Chip(
                    avatar: CircleAvatar(
                        backgroundColor: Colors.blue.shade900, child: new Text('D', style: TextStyle(fontSize: 10.0),)),
                    label: Text('董得'),
                ),
                Chip(
                    avatar: CircleAvatar(
                        backgroundColor: Colors.blue.shade900, child: new Text('E', style: TextStyle(fontSize: 10.0),)),
                    label: Text('一哥'),
                ),
                Chip(
                    avatar: CircleAvatar(
                        backgroundColor: Colors.blue.shade900, child: new Text('F', style: TextStyle(fontSize: 10.0),)),
                    label: Text('福建'),
                ),
                Chip(
                    avatar: CircleAvatar(
                        backgroundColor: Colors.blue.shade900, child: new Text('G', style: TextStyle(fontSize: 10.0),)),
                    label: Text('歌声'),
                ),
                Chip(
                    avatar: CircleAvatar(
                        backgroundColor: Colors.blue.shade900, child: new Text('G', style: TextStyle(fontSize: 10.0),)),
                    label: Text('歌声2'),
                ),
                Chip(
                    avatar: CircleAvatar(
                        backgroundColor: Colors.blue.shade900, child: new Text('G', style: TextStyle(fontSize: 10.0),)),
                    label: Text('歌声3'),
                ),
                Chip(
                    avatar: CircleAvatar(
                        backgroundColor: Colors.blue.shade900, child: new Text('G', style: TextStyle(fontSize: 10.0),)),
                    label: Text('歌声4'),
                ),
                Padding(
                    padding: EdgeInsets.fromLTRB(8.0, 15.0, 8.0, 0.0),
                    child: Text('我是纯文本'),
                ),
                Padding(
                    padding: EdgeInsets.fromLTRB(8.0, 15.0, 8.0, 0.0),
                    child: Text('我是纯文本2'),
                ),
                Padding(
                    padding: EdgeInsets.fromLTRB(8.0, 15.0, 8.0, 0.0),
                    child: Text('我是纯文本3'),
                ),
                Padding(
                    padding: EdgeInsets.fromLTRB(8.0, 15.0, 8.0, 0.0),
                    child: Text('我是纯文本4'),
                ),
                Padding(
                    padding: EdgeInsets.fromLTRB(8.0, 15.0, 8.0, 0.0),
                    child: Text('我是纯文本5'),
                ),
                Padding(
                    padding: EdgeInsets.fromLTRB(8.0, 15.0, 8.0, 0.0),
                    child: Text('我是纯文本6'),
                ),
                Container(
                    constraints: new BoxConstraints.expand(
                        width: 100.0,
                        height:50.0, //Theme.of(context).textTheme.display1.fontSize * 1.1 + 200.0,
                    ),
                    decoration: new BoxDecoration(
                        border: new Border.all(width: 2.0, color: Colors.red),
                        color: Colors.grey,
                        borderRadius: new BorderRadius.all(new Radius.circular(10.0)),
                        image: new DecorationImage(
                            image: new NetworkImage('http://h.hiphotos.baidu.com/zhidao/wh%3D450%2C600/sign=0d023672312ac65c67506e77cec29e27/9f2f070828381f30dea167bbad014c086e06f06c.jpg'),
                            centerSlice: new Rect.fromLTRB(270.0, 180.0, 1360.0, 730.0),
                        ),
                    ),
                    padding: const EdgeInsets.all(8.0),
                    alignment: Alignment.center,
                    child: new Text('Hello',
                        style: Theme.of(context).textTheme.display1.copyWith(color: Colors.black)),
                    transform: new Matrix4.rotationZ(0.3),
                ),
                Container(
                    constraints: new BoxConstraints.expand(
                        width: 100.0,
                        height:50.0, //Theme.of(context).textTheme.display1.fontSize * 1.1 + 200.0,
                    ),
                    decoration: new BoxDecoration(
                        border: new Border.all(width: 2.0, color: Colors.red),
                        color: Colors.grey,
                        borderRadius: new BorderRadius.all(new Radius.circular(10.0)),
                        image: new DecorationImage(
                            image: new NetworkImage('http://h.hiphotos.baidu.com/zhidao/wh%3D450%2C600/sign=0d023672312ac65c67506e77cec29e27/9f2f070828381f30dea167bbad014c086e06f06c.jpg'),
                            centerSlice: new Rect.fromLTRB(270.0, 180.0, 1360.0, 730.0),
                        ),
                    ),
                    padding: const EdgeInsets.all(8.0),
                    alignment: Alignment.center,
                    child: new Text('Hello',
                        style: Theme.of(context).textTheme.display1.copyWith(color: Colors.black)),
                    transform: new Matrix4.rotationZ(0.3),
                ),
                Container(
                    margin: const EdgeInsets.only(top: 10.0),
                    child: new LYRoundButton(
                        title: new Text(
                            "点击找我",
                            style: new TextStyle(
                                fontSize: 18.0,
                                color: Colors.white,
                            ),
                        ),
                        disabled: false,
                        onPress: () {
                            ToastUtils.showMsg('找我有事？');
                        },
                    ),
                ),
            ],
        );
    }

    //测试事件
    Widget _eventDemo() {
        return new Listener(
            child: Container(
                alignment: Alignment.center,
                color: Colors.white,
                width: double.infinity,
                height: double.infinity,
                child: Text(_event?.toString()??"TEST UI",style: TextStyle(color: Colors.blue)),
            ),
            onPointerDown: (PointerDownEvent event) => setState(()=>_event=event),
            onPointerMove: (PointerMoveEvent event) => setState(()=>_event=event),
            onPointerUp: (PointerUpEvent event) => setState(()=>_event=event),
        );
    }
    
    
    
}

class TestUIPage extends StatefulWidget {
    @override
    createState() => new TestUIPageState();
}

class LYRoundButton extends StatefulWidget {
    static const defaultBackgroundColor = const Color(0xFF8B5FFE);
    static const defaultActiveBackgroundColor = const Color(0xB38B5FFE);
    static const defaultDisabledBackgroundColor = const Color(0x338B5FFE);
    
    LYRoundButton({
        this.title,
        this.onPress,
        this.height = 52.0,
        this.width = double.infinity,
        this.disabled = false,
        this.backgroundColor = defaultBackgroundColor,
        this.activeBackgroundColor = defaultActiveBackgroundColor,
        this.disabledBackgroundColor = defaultDisabledBackgroundColor,
    });
    
    final Widget title;
    final Color backgroundColor, activeBackgroundColor, disabledBackgroundColor;
    final VoidCallback onPress;
    final double height, width;
    final bool disabled;
    
    @override
    _LYRoundButtonState createState() => new _LYRoundButtonState();
}

class _LYRoundButtonState extends State<LYRoundButton> {
    Color currentColor;
    
    @override
    void initState() {
        super.initState();
        if (widget.disabled) {
            currentColor = widget.disabledBackgroundColor;
        } else {
            currentColor = widget.backgroundColor;
        }
    }
    
    @override
    void deactivate() {
        super.deactivate();
        currentColor = widget.backgroundColor;
    }
    
    @override
    Widget build(BuildContext context) {
        return new GestureDetector(
            onTap: () {
                if (widget.onPress != null && !widget.disabled) {
                    widget.onPress();
                }
            },
            onTapDown: (TapDownDetails details) {
                if (!widget.disabled) {
                    setState(() {
                        currentColor = widget.activeBackgroundColor;
                    });
                }
            },
            onTapUp: (TapUpDetails details) {
                if (!widget.disabled) {
                    setState(() {
                        currentColor = widget.backgroundColor;
                    });
                }
            },
            onTapCancel: () {
                if (!widget.disabled) {
                    setState(() {
                        currentColor = widget.backgroundColor;
                    });
                }
            },
            child: new Container(
                decoration: new BoxDecoration(
                    color: currentColor,
                    borderRadius:
                    new BorderRadius.all(new Radius.circular(widget.height / 2.0)),
                ),
                height: widget.height,
                width: widget.width,
                alignment: Alignment.center,
                child: widget.title,
            ),
        );
    }
}